@import url(http://weloveiconfonts.com/api/?family=entypo);

*:focus { outline:none; }

body.blur {
  .sidebar {
    /* Rectangle 15: */
    background-image: -o-linear-gradient(-89deg, #F7F7F7 0%, #EBEBEB 100%);
    background-image: -moz-linear-gradient(-89deg, #F7F7F7 0%, #EBEBEB 100%);
    background-image: -ms-linear-gradient(-89deg, #F7F7F7 0%, #EBEBEB 100%);
    background-image: linear-gradient(-179deg, #F7F7F7 0%, #EBEBEB 100%);
  }

  ul.nav li.selected {
    /* Rectangle 16: */
    background-image: -o-linear-gradient(-89deg, #BDC7DD 0%, #A6B2CD 100%, #9DA9C6 100%);
    background-image: -moz-linear-gradient(-89deg, #BDC7DD 0%, #A6B2CD 100%, #9DA9C6 100%);
    background-image: -ms-linear-gradient(-89deg, #BDC7DD 0%, #A6B2CD 100%, #9DA9C6 100%);
    background-image: linear-gradient(-179deg, #BDC7DD 0%, #A6B2CD 100%, #9DA9C6 100%);
    -moz-box-shadow: inset 0px -1px 0px 0px #93A0BA, inset 0px 1px 0px 0px #BBC5D7, inset 0px 2px 0px 0px #C3CCE0;
    box-shadow: inset 0px -1px 0px 0px #93A0BA, inset 0px 1px 0px 0px #BBC5D7, inset 0px 2px 0px 0px #C3CCE0;

    span.sidebar-badge {
      color: #acb6d0 !important;
    }
  }

  table.table-maverix {

    tr.selected {
      color: #000000;
      background-color: #cbcbcb !important;

      select.on-white-select {
        background-color: #cbcbcb;
      }

      .info-sub {
        color: #787878 !important;
      }

    }

  }

}

/* entypo */
[class*="entypo-"]:before {
  font-family: 'entypo', sans-serif;
}

body {
  font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
}

p {
  margin-bottom: 20px;
  margin-top: 5px;
}

.sidebar {
  position: absolute;
  overflow: scroll;
  top: 0;
  bottom: 0;
  width: 254px;
  z-index: 2;

  /* sidebar: */
  background: #E5E9EE;
  -moz-box-shadow: 1px 0px 0px 0px rgba(0, 0, 0, 0.24), inset -1px 0px 0px 0px rgba(254, 255, 255, 0.27);
  box-shadow: 1px 0px 0px 0px rgba(0, 0, 0, 0.24), inset -1px 0px 0px 0px rgba(254, 255, 255, 0.27);

  /* Rectangle 12: */
  background-image: -o-linear-gradient(-89deg, #E8ECF1 0%, #D1D8E0 100%);
  background-image: -moz-linear-gradient(-89deg, #E8ECF1 0%, #D1D8E0 100%);
  background-image: -ms-linear-gradient(-89deg, #E8ECF1 0%, #D1D8E0 100%);
  background-image: linear-gradient(-179deg, #E8ECF1 0%, #D1D8E0 100%);

  div.sidebar-navicontainer {
    margin-bottom: 5px;
  }
  div.sidebar-headbox {

    &:hover {
      .sidebar-toggle {
        opacity: 1;

        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
      }
    }

    .sidebar-header {
      font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
      font-weight: bold;
      font-size: 11px;
      color: #707E8C;
      line-height: 13px;
      /* FAVORITES: */
      text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.46);
      text-transform: uppercase;

      display: inline-block;
      padding: 5px 9px;
    }

    .sidebar-toggle {
      opacity: 0;
      cursor: pointer;
      font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
      font-weight: bold;
      font-size: 11px;
      color: #98A5B2;
      line-height: 13px;
      text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.60);

      float: right;
      margin-top: 5px;
      padding-right: 10px;

      &:hover {
        text-decoration: none;
      }

      &:active {
        color: #5069ec;
      }
    }
  }

  ul.nav {

    li {
      font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
      font-size: 13px;
      line-height: 13px;
      color: #000000;

      padding: 4px 28px;
      padding-top: 3px;
      padding-right: 10px;
      text-shadow: 0px 1px 0px #FFFFFF;
      margin-bottom: 1px;

      &.selected {
        color: #FFFFFF;
        text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.50);
        font-weight: bold;

        /* Rectangle 17: */
        background-image: -o-linear-gradient(-89deg, #69B1E5 0%, #3485D0 100%);
        background-image: -moz-linear-gradient(-89deg, #69B1E5 0%, #3485D0 100%);
        background-image: -ms-linear-gradient(-89deg, #69B1E5 0%, #3485D0 100%);
        background-image: linear-gradient(-179deg, #69B1E5 0%, #3485D0 100%);
        -moz-box-shadow: 0px -1px 0px 0px #5CA4DF, inset 0px -1px 0px 0px #327AC2, inset 0px 1px 0px 0px #71B9EA;
        box-shadow: 0px -1px 0px 0px #5CA4DF, inset 0px -1px 0px 0px #327AC2, inset 0px 1px 0px 0px #71B9EA;

        span {
          color: #FFFFFF;
          text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.10);
        }

        .sidebar-badge {
          background-color: #ffffff;
          color: #4b8fd5 !important;
        }

        a {
          color: #ffffff !important;
          &:focus{
              background: none !important;
          }
        }
      }

      a {
        text-decoration: none;
        color: #000000 !important;
        padding: 0;

        &:hover {
          background: none !important;
        }
      }

      span {
        color: #818896;
        font-size: 18px;
        text-shadow: 0px 1px 0px #FFFFFF;
        width: 20px;
        display: inline-block;
        text-align: center;

      }

      .sidebar-badge {
        float: right;
        background-color: #98A5B3;
        border-radius: 50px;
        font-size: 11px !important;
        line-height: 15px;
        color: #ffffff !important;
        font-weight: bold;
        text-shadow: none;
      }

    }
  }

}

.content {
  position: absolute;
  left: 254px;
  right: 0;
  top: 88px;
  bottom: 0;
  overflow-y: scroll;

  .container-fluid {
    padding: 20px;
  }

  .container-maverix {
    width: 680px;
    margin: 0 auto;

    font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
    font-size: 13px;
    color: #000000;
    line-height: 16px;
    /* Status:: */
    padding-top: 25px;
  }

}

div.heading-bar {

  .user-bar {
    position: absolute;
    top: 0;
    right: 10px;
    font-size: 11px;
    line-height: 30px;
  }

  position: absolute;
  top: 0;
  left: 255px;
  right: 0;
  z-index: 2;
  min-width: 680px;

  /* Rectangle 142: */
  background-image: -o-linear-gradient(-89deg, #EFEEF1 0%, #D5D9DC 100%);
  background-image: -moz-linear-gradient(-89deg, #EFEEF1 0%, #D5D9DC 100%);
  background-image: -ms-linear-gradient(-89deg, #EFEEF1 0%, #D5D9DC 100%);
  background-image: linear-gradient(-179deg, #EFEEF1 0%, #D5D9DC 100%);
  border-bottom: 1px solid #C2C2C2;

  height: 88px;
  padding: 20px;

  .heading-one {
    display: table-cell;
    vertical-align: middle;

    font-family: Helvetica Neue, Helvetica, Arial;
    font-weight: bold;
    font-size: 24px;
    color: #3A3D40;
    line-height: 29px;
    letter-spacing: -1px;

    /* Dateifreigabe: */
    text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.46) !important;

    img {
      margin-right: 10px;
    }
  }

}

.sub-nav {
  background-image: -o-linear-gradient(-89deg, #F5F5F5 0%, #E5E5E5 100%);
  background-image: -moz-linear-gradient(-89deg, #F5F5F5 0%, #E5E5E5 100%);
  background-image: -ms-linear-gradient(-89deg, #F5F5F5 0%, #E5E5E5 100%);
  background-image: linear-gradient(-179deg, #F5F5F5 0%, #E5E5E5 100%);
  border: 1px solid #C2C2C2;
  border-left: none;
  border-right: none;
  -moz-box-shadow: inset 0px 1px 0px 0px #FFFFFF;
  box-shadow: inset 0px 1px 0px 0px #FFFFFF;

  height: 25px;

  position: fixed;
  top: 87px;
  left: 255px;
  right: 0;

  ul {
    position: absolute;
    top: -1px;
    left: 0px;
    right: 0px;

    padding: 0;
    text-align: center;
    li {
      display: inline-block;
      margin-left: -6px;

      /* Rectangle 14: */
      background-image: -o-linear-gradient(-89deg, #F5F5F5 0%, #E5E5E5 100%);
      background-image: -moz-linear-gradient(-89deg, #F5F5F5 0%, #E5E5E5 100%);
      background-image: -ms-linear-gradient(-89deg, #F5F5F5 0%, #E5E5E5 100%);
      background-image: linear-gradient(-179deg, #F5F5F5 0%, #E5E5E5 100%);
      border: 1px solid #C2C2C2;
      -moz-box-shadow: inset 1px 1px 0px 0px #FFFFFF;
      box-shadow: inset 1px 1px 0px 0px #FFFFFF;

      &.selected {
        z-index: 99;
        background-image: -o-linear-gradient(-89deg, #E1E1E1 0%, #E6E6E6 100%);
        background-image: -moz-linear-gradient(-89deg, #E1E1E1 0%, #E6E6E6 100%);
        background-image: -ms-linear-gradient(-89deg, #E1E1E1 0%, #E6E6E6 100%);
        background-image: linear-gradient(-179deg, #E1E1E1 0%, #E6E6E6 100%);
        border: 1px solid #A8A8A8;
        -moz-box-shadow: inset -1px 0px 0px 0px #D3D3D3, inset 1px 0px 0px 0px #D4D4D4, inset 0px 1px 0px 0px #DFDFDF, inset 0px -1px 0px 0px #E5E5E5;
        box-shadow: inset -1px 0px 0px 0px #D3D3D3, inset 1px 0px 0px 0px #D4D4D4, inset 0px 1px 0px 0px #DFDFDF, inset 0px -1px 0px 0px #E5E5E5;
      }

      a {
        display: inline-block;
        padding: 4px 40px;
        font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
        font-weight: bold;
        font-size: 12px;
        color: #686868;
        line-height: 15px;
        text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.60);

        &:hover {
          text-decoration: none !important;
        }
      }

    }
  }
}

.sub-nav-content-container {
  padding-top: 20px;
}

// Buttons
.btn {
  border-radius: 4px;
  border: 1px solid #979797;
  padding-top: 0px;
  padding-bottom: 0px;
  height: 21px;

  font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
  color: #000000;
  font-size: 13px;
  line-height: 19px;

  display: inline-block;

  &:hover {
    color: #000000;
  }

  &.btn-default {
    background-image: -o-linear-gradient(0deg, #EDEDED 0%, #F3F3F3 50%, #FAFAFA 50%, #FFFFFF 100%);
    background-image: -moz-linear-gradient(0deg, #EDEDED 0%, #F3F3F3 50%, #FAFAFA 50%, #FFFFFF 100%);
    background-image: -ms-linear-gradient(0deg, #EDEDED 0%, #F3F3F3 50%, #FAFAFA 50%, #FFFFFF 100%);
    background-image: linear-gradient(0deg, #EDEDED 0%, #F3F3F3 50%, #FAFAFA 50%, #FFFFFF 100%);

    -moz-box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.14), inset 0px 0px 0px 1px rgba(255, 255, 255, 0.42), inset 0px 1px 0px 0px rgba(255, 255, 255, 0.53);
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.14), inset 0px 0px 0px 1px rgba(255, 255, 255, 0.42), inset 0px 1px 0px 0px rgba(255, 255, 255, 0.53);

    &:active {
      background-color: #EDEDED;
      background-image: none;

      /* Rectangle 20: */
      background-image: -o-linear-gradient(0deg, #A1C5EB 0%, #649FEC 46%, #4191EC 53%, #94C4EB 100%);
      background-image: -moz-linear-gradient(0deg, #A1C5EB 0%, #649FEC 46%, #4191EC 53%, #94C4EB 100%);
      background-image: -ms-linear-gradient(0deg, #A1C5EB 0%, #649FEC 46%, #4191EC 53%, #94C4EB 100%);
      background-image: linear-gradient(0deg, #A1C5EB 0%, #649FEC 46%, #4191EC 53%, #94C4EB 100%);
      border: 1px solid #557BC8;
    }
  }

  &.btn-primary {
    border-top-color: #595b71;
    border-bottom-color: #515268;
    border-left-color: #56586f;
    border-right-color: #56586f;
    background-image: -webkit-gradient(
            linear,
            left bottom,
            left top,
            color-stop(0, #D3F7FD),
            color-stop(0.5, #87C5FB),
            color-stop(0.5, #A1D1F9),
            color-stop(1, #D4E9FC)
    );
    background-image: -moz-linear-gradient(
            center bottom,
            #D3F7FD 0%,
            #87C5FB 50%,
            #A1D1F9 50%,
            #D4E9FC 100%
    );
    -webkit-animation-name: blinking;
    -webkit-animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-duration: 1s;
    -moz-animation-name: blinking;
    -moz-animation-timing-function: ease-in-out;
    -moz-animation-iteration-count: infinite;
    -moz-animation-duration: 1s;
    animation-name: blinking;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-duration: 1s;

    &:active {
      background-color: #EDEDED;
      background-image: none;

      /* Rectangle 20: */
      background-image: -o-linear-gradient(0deg, #A1C5EB 0%, #649FEC 46%, #4191EC 53%, #94C4EB 100%);
      background-image: -moz-linear-gradient(0deg, #A1C5EB 0%, #649FEC 46%, #4191EC 53%, #94C4EB 100%);
      background-image: -ms-linear-gradient(0deg, #A1C5EB 0%, #649FEC 46%, #4191EC 53%, #94C4EB 100%);
      background-image: linear-gradient(0deg, #A1C5EB 0%, #649FEC 46%, #4191EC 53%, #94C4EB 100%);
      border: 1px solid #557BC8;
    }
  }

  &.disabled {
    background-image: -o-linear-gradient(0deg, #EDEDED 0%, #F3F3F3 50%, #FAFAFA 50%, #FFFFFF 100%);
    background-image: -moz-linear-gradient(0deg, #EDEDED 0%, #F3F3F3 50%, #FAFAFA 50%, #FFFFFF 100%);
    background-image: -ms-linear-gradient(0deg, #EDEDED 0%, #F3F3F3 50%, #FAFAFA 50%, #FFFFFF 100%);
    background-image: linear-gradient(0deg, #EDEDED 0%, #F3F3F3 50%, #FAFAFA 50%, #FFFFFF 100%);
    border: 1px solid #979797;
    -moz-box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.14), inset 0px 0px 0px 1px rgba(255, 255, 255, 0.42), inset 0px 1px 0px 0px rgba(255, 255, 255, 0.53);
    box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.14), inset 0px 0px 0px 1px rgba(255, 255, 255, 0.42), inset 0px 1px 0px 0px rgba(255, 255, 255, 0.53);
  }

  &.btn-capsule {
    border-radius: 40px;
    height: 16px;
    background-image: -o-linear-gradient(-89deg, #FBFBFB 0%, #DFDFDF 100%);
    background-image: -moz-linear-gradient(-89deg, #FBFBFB 0%, #DFDFDF 100%);
    background-image: -ms-linear-gradient(-89deg, #FBFBFB 0%, #DFDFDF 100%);
    background-image: linear-gradient(-179deg, #FBFBFB 0%, #DFDFDF 100%);
    border: 1px solid #979797;
    -moz-box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.14);
    box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.14);

    font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
    font-size: 11px;
    color: #000000;
    line-height: 14px;
    text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.50);

    &:active {
      background-color: #dadada;
      background-image: none;
    }

  }

  &.btn-sm {
    border-radius: 3px;
    background-image: -o-linear-gradient(89deg, #EDEDED 0%, #F3F3F3 50%, #FAFAFA 50%, #FFFFFF 100%);
    background-image: -moz-linear-gradient(89deg, #EDEDED 0%, #F3F3F3 50%, #FAFAFA 50%, #FFFFFF 100%);
    background-image: -ms-linear-gradient(89deg, #EDEDED 0%, #F3F3F3 50%, #FAFAFA 50%, #FFFFFF 100%);
    background-image: linear-gradient(-1deg, #EDEDED 0%, #F3F3F3 50%, #FAFAFA 50%, #FFFFFF 100%);
    border: 1px solid #979797;
    -moz-box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.14), inset 0px 0px 0px 1px rgba(255, 255, 255, 0.42), inset 0px 1px 0px 0px rgba(255, 255, 255, 0.53);
    box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.14), inset 0px 0px 0px 1px rgba(255, 255, 255, 0.42), inset 0px 1px 0px 0px rgba(255, 255, 255, 0.53);

    font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
    font-size: 11px;
    color: #000000;
    line-height: 13px;

    display: inline-block;
    height: 16px;

    &:active {
      background-color: #dadada;
      background-image: none;
    }
  }

  &.btn-lg {
    height: 31px;
    line-height: 31px;
    font-size: 16px !important;
    padding-top: 0;
    padding-bottom: 0;
  }

  &.btn-on-grey {

    /* Rectangle 21: */
    background-image: -o-linear-gradient(-89deg, #FDFDFD 0%, #ECECEC 100%);
    background-image: -moz-linear-gradient(-89deg, #FDFDFD 0%, #ECECEC 100%);
    background-image: -ms-linear-gradient(-89deg, #FDFDFD 0%, #ECECEC 100%);
    background-image: linear-gradient(-179deg, #FDFDFD 0%, #ECECEC 100%);
    border: 1px solid #8E8E8E;

    font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
    font-size: 13px;

    min-width: 96px;

    &:active {

      /* Rectangle 21: */
      background-image: -o-linear-gradient(-89deg, #E6E6E6 0%, #E3E3E3 100%);
      background-image: -moz-linear-gradient(-89deg, #E6E6E6 0%, #E3E3E3 100%);
      background-image: -ms-linear-gradient(-89deg, #E6E6E6 0%, #E3E3E3 100%);
      background-image: linear-gradient(-179deg, #E6E6E6 0%, #E3E3E3 100%);
      border: 1px solid #8E8E8E;
      -moz-box-shadow: inset 0px 1px 5px 0px rgba(0, 0, 0, 0.40);
      box-shadow: inset 0px 1px 5px 0px rgba(0, 0, 0, 0.40);
    }
  }

  &.btn-modern {
    border-radius: 4px;
    /* Rectangle 9: */
    background-color: #ffffff !important;
    background-image: none !important;
    /* Sketch doesnt export gradient borders at this point */
    -moz-box-shadow: 0px 1px 1px 0px rgba(255, 254, 255, 0.59), inset 0px 1px 2px 0px #FFFFFF;
    box-shadow: 0px 1px 1px 0px rgba(255, 254, 255, 0.59), inset 0px 1px 2px 0px #FFFFFF;

    font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
    font-size: 12px;
    list-style: 12px;
    color: #333;

    &:active, &.btn-sm:active {
      background-image: none;
      outline: 0;
      -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
      box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125)
    }

    span[class^="entypo-"], span[class*=" entypo-"] {
      font-size: 14px;
    }
  }

  &.btn-help {
    /* Oval 7: */
    background-image: -o-linear-gradient(-89deg, #FFFFFF 0%, #F3F3F3 50%, #ECECEC 50%, #F1F1F1 100%);
    background-image: -moz-linear-gradient(-89deg, #FFFFFF 0%, #F3F3F3 50%, #ECECEC 50%, #F1F1F1 100%);
    background-image: -ms-linear-gradient(-89deg, #FFFFFF 0%, #F3F3F3 50%, #ECECEC 50%, #F1F1F1 100%);
    background-image: linear-gradient(-179deg, #FFFFFF 0%, #F3F3F3 50%, #ECECEC 50%, #F1F1F1 100%);
    border: 1px solid #8D8D8D;
    border-radius: 30px;
    height: 21px;
    width: 21px;
    display: inline-block;
    color: #434343;
    padding: 0;
  }
}

// Wells
.panel {
  /* bg: */
  background: rgba(239, 239, 239, 0.99);
  border: 1px solid rgba(0, 0, 0, 0.49);
  -moz-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.45);
  box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.45);

  .panel-body {
    font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
    font-size: 13px;
    color: #000000;
    line-height: 16px;
    /* Before noon:: */
  }
  .panel-heading {
    /* Rectangle 130: */
    background-image: -o-linear-gradient(-89deg, #EDEDED 0%, #D8D8D8 100%);
    background-image: -moz-linear-gradient(-89deg, #EDEDED 0%, #D8D8D8 100%);
    background-image: -ms-linear-gradient(-89deg, #EDEDED 0%, #D8D8D8 100%);
    background-image: linear-gradient(-179deg, #EDEDED 0%, #D8D8D8 100%);
    -moz-box-shadow: 0px 1px 0px 0px #BFBFBF;
    box-shadow: 0px 1px 0px 0px #BFBFBF;

    .panel-title {
      font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
      font-size: 13px;
      color: #2F2F2F;
      line-height: 16px;
      /* Window title: */
      text-shadow: 0px 1px 0px rgba(254, 255, 255, 0.49);
    }
  }
}

// Tables

div.table-cell {
  height: 150px;
  border: 1px solid rgba(0, 0, 0, 0.17);
  width: 100%;
  overflow: scroll;
  margin-bottom: 1em;
}

table.table-maverix {

  width: 100%;

  tr.selected {
    color: #ffffff;
    background-color: #3874D7;

    select {
      background-color: #3874D7;
    }

    .info-sub {
      color: #ffffff !important;
    }

  }

  td {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
    padding: 2px;
  }

  p.info-main {
    font-weight: bold;
    margin: 0;
    line-height: 13px;
  }

  p.info-sub {
    font-size: 11px;
    color: #787878;
    line-height: 13px;
    margin: 0;
    /* Connected: */
  }
}

.table-maverix-small {
  font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
  font-size: 11px;
  color: #000000;
  line-height: 13px;
  letter-spacing: 0px;

  td {
    border: none !important;
  }

  td.td-icon {
    font-size: 15px;
    width: 20px;
  }

  select.on-white-select {
    background-color: #ffffff;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 150px;
    border: none;
  }
  span.entypo-arrow-combo {
    position: relative;
    left: -10px;
  }
}

.table-maverix-large {
  td {
    border-top: none !important;
    border-bottom: 1px solid #e6e6e6 !important;

    &.td-icon {
      width: 1em;
      font-size: 20px;
    }

    div.placeholder {
      min-height: 40px;
    }
  }
}

// UI Switch inspired by https://github.com/nitrous-io/ember-sf-april/blob/master/package.nw/css/style.css

.ui-switch {
  box-sizing: border-box;
  position: relative;
  width: 40px;
  height: 24px;
  background-color: #ddd;
  border-radius: 12px;
  transition: background-color .3s;

  // Quickfix not in line with span
  display: inline-block;
  top: 7px;
}

/*.ui-switch .disabled-background {
  position: absolute;
  top: 1px;
  left: 1px;
  width: 38px;
  height: 22px;
  background-color: #fff;
  border-radius: 11px;
  transition: top .3s, left .3s, width .3s, height .3s;
}*/

.ui-switch .toggler {
  position: absolute;
  top: 1px;
  left: 1px;
  width: 22px;
  height: 22px;
  background-color: #fff;
  border-radius: 11px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.2);
  transition: left .3s;
}

.ui-switch.on {
  background-color: #77ce65;
}

/*.ui-switch.on .disabled-background {
  top: 11px;
  left: 19px;
  width: 1px;
  height: 1px;
}*/

.ui-switch.on .toggler {
  left: 17px;
}

.ui-label {
  font-family: Helvetica Neue, Helvetica, Arial;
  font-weight: bold;
  font-size: 13px;
  color: #4A4A4A;
  line-height: 16px;
  text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.80);

  display: inline-block;
  padding: 4px;
}

// Dropdown Button
a.dropdown-toggle {
  color: #616161 !important;

  &:hover {
    color: #616161 !important;
  }
}

// Toggle: extends http://ghinda.net/css-toggle-switch/

#top-switch {
  position: fixed;
  top: 30px;
  right: 50px;
  padding-top: 0px;
}

.osx-switch {
  padding-left: 30px;
  padding-top: 20px;

  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;

  .osx-switch-label {
    font-family: Helvetica Neue, Helvetica, Arial;
    font-weight: bold;
    font-size: 13px;
    color: #4A4A4A;
    line-height: 16px;
    text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.80);
  }

  .osx-switch-label-active {
    position: relative;
    left: -30px;
  }

  .osx-switch-label-inactive {
    position: relative;
    right: -55px;
  }

  label {
    position: relative;
    top: -20px;
    width: 70px;
    height: 22px;
    margin: 0;
    padding: 0;

    /* Rectangle 9: */
    background-image: -o-linear-gradient(-89deg, #818181 0%, #B8B8B8 100%);
    background-image: -moz-linear-gradient(-89deg, #818181 0%, #B8B8B8 100%);
    background-image: -ms-linear-gradient(-89deg, #818181 0%, #B8B8B8 100%);
    background-image: linear-gradient(-179deg, #818181 0%, #B8B8B8 100%);
    -moz-box-shadow: inset 0px 1px 2px 0px rgba(0, 0, 0, 0.50);
    box-shadow: inset 0px 1px 2px 0px rgba(0, 0, 0, 0.20);

    border-top: 1px solid #5C5C5C;
    border-bottom: 1px solid #989898;

    a {
      margin-top: -1px;
      height: 22px;
      box-shadow: none;

      /* Rectangle 10: */
      background-image: -o-linear-gradient(-89deg, #FDFDFD 0%, #ECECEC 100%);
      background-image: -moz-linear-gradient(-89deg, #FDFDFD 0%, #ECECEC 100%);
      background-image: -ms-linear-gradient(-89deg, #FDFDFD 0%, #ECECEC 100%);
      background-image: linear-gradient(-179deg, #FDFDFD 0%, #ECECEC 100%);
      border: 1px solid #7D7D7D;
    }
  }
}

// Headings
h1 {
  font-family: Helvetica Neue, Helvetica, Arial;
  font-weight: 100;
}

h2 {
  font-family: Helvetica Neue, Helvetica, Arial;
  font-size: 18px;
  font-weight: normal;
  color: #62676C;
  line-height: 18px;
  margin-bottom: 5px;
  margin-top: 20px;

  &:first-child {
    // needed for .sub-nav-content-container
    margin-top: 0px;
  }

  @media screen and (-webkit-min-device-pixel-ratio: 0) {
    /* CSS Statements that only apply on webkit-based browsers (Chrome, Safari, etc.) */
    font-weight: 300;
  }

}

h3 {
  font-family: Helvetica Neue, Helvetica, Arial;
  font-weight: bold;
  font-size: 14px;
  color: #4A4A4A;
  line-height: 17px;
  text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.80);
  margin-bottom: 0;
}

// Forms
progress[value] {
  width: 100%;
}

input[type=text], input[type=password], input[type=email] {
  border-radius: 0 !important;
  padding: 0 3px !important;
  font-size: 13px !important;
  line-height: 13px !important;
  color: #39090a !important;
  height: 22px !important;

  /* Rectangle 6: */
  background: #FFFFFF;
  border: 1px solid #9B9B9B !important;
  border-top: 1px solid #8e8e8e !important;
  border-bottom: 1px solid #afafaf !important;
  -moz-box-shadow: inset 0px 1px 3px 0px rgba(0, 0, 0, 0.20) !important;
  box-shadow: inset 0px 1px 3px 0px rgba(0, 0, 0, 0.20) !important;

  &::-webkit-input-placeholder {
    padding-top: 1px;
    color: #777777;
  }

  &:-moz-placeholder {
    /* Firefox 18- */
    padding-top: 1px;
    color: #777777;
  }

  &::-moz-placeholder {
    /* Firefox 19+ */
    padding-top: 1px;
    color: #777777;
  }

  &:-ms-input-placeholder {
    padding-top: 1px;
    color: #777777;
  }

  &:focus {
    outline: none !important;
    border: 1px solid #6A9ECF !important;
    -moz-box-shadow: 0px 0px 2px 1px #71A5D6, inset 0px 0px 2px 1px #71A5D6 !important;
    box-shadow: 0px 0px 2px 1px #71A5D6, inset 0px 0px 2px 1px #71A5D6 !important;
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    -o-transition: none;
    transition: none;
  }

}

select.select-large {
  font-size: 16px;
}

textarea {
  padding: 3px !important;
  font-size: 13px !important;
  color: #39090a !important;

  border: 1px solid #9B9B9B !important;
  border-top: 1px solid #8e8e8e !important;
  border-bottom: 1px solid #afafaf !important;
  -moz-box-shadow: inset 0px 1px 3px 0px rgba(0, 0, 0, 0.20) !important;
  box-shadow: inset 0px 1px 3px 0px rgba(0, 0, 0, 0.20) !important;

  &:focus {
    outline: none !important;
    border: 1px solid #6A9ECF !important;
    -moz-box-shadow: 0px 0px 2px 1px #71A5D6, inset 0px 0px 2px 1px #71A5D6 !important;
    box-shadow: 0px 0px 2px 1px #71A5D6, inset 0px 0px 2px 1px #71A5D6 !important;
    -webkit-transition: none;
    -moz-transition: none;
    -ms-transition: none;
    -o-transition: none;
    transition: none;
  }
}

input[type=checkbox] {
  font-size: 20px;
  line-height: 20px;
  position: relative;
  top: -3px;
}

input[type=search] {
  -webkit-appearance: searchfield;

  font-size: 32px;

}

input.mvx-search {
  display: inline-block !important;
  border-radius: 13px !important;
  border: 1px solid #ffffff;

  /* Rectangle 11: */
  background: #FFFFFF;
  -moz-box-shadow: inset 0px -1px 0px 0px #C6C6C6, inset 0px 1px 0px 0px #A6A6A6, inset 0px 1px 3px 0px rgba(0, 0, 0, 0.50);
  box-shadow: inset 0px -1px 0px 0px #C6C6C6, inset 0px 1px 0px 0px #A6A6A6, inset 0px 1px 3px 0px rgba(0, 0, 0, 0.50);

  padding-left: 26px !important;
  padding-right: 22px !important;

  height: 24px !important;
}

span.search-input {
  span {
    color: #777777;
    position: relative;
    left: 12px;
    font-size: 16px;
  }
  input {
    margin-left: -12px;
  }
}

ul.dropdown-menu {
  font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
  font-size: 13px;
  color: #000000;
  line-height: 16px;
  /* Alle löschen: */
  border-radius: 5px !important;

  a {
    line-height: 18px;
    padding: 0 20px;
    border-top: 1px solid rgba(255, 255, 255, 0);
    border-bottom: 1px solid rgba(255, 255, 255, 0);
  }

  li.disabled a:hover {
    border-top: 1px solid rgba(255, 255, 255, 0);
    border-bottom: 1px solid rgba(255, 255, 255, 0);
  }

  a:hover {
    color: #ffffff;

    /* Rectangle 18: */
    background-image: -o-linear-gradient(-89deg, #6288F8 0%, #2261F6 100%);
    background-image: -moz-linear-gradient(-89deg, #6288F8 0%, #2261F6 100%);
    background-image: -ms-linear-gradient(-89deg, #6288F8 0%, #2261F6 100%);
    background-image: linear-gradient(-179deg, #6288F8 0%, #2261F6 100%);

    border-top: 1px solid #587FEE;
    border-bottom: 1px solid #0D52EB;
  }

}

span.on-badge {
  display: inline-block;
  border-radius: 5px;

  width: 10px;
  height: 10px;

  /* Oval 3: */
  background-image: -o-linear-gradient(-89deg, #A0D071 50%, #E5FC97 100%);
  background-image: -moz-linear-gradient(-89deg, #A0D071 50%, #E5FC97 100%);
  background-image: -ms-linear-gradient(-89deg, #A0D071 50%, #E5FC97 100%);
  background-image: linear-gradient(-179deg, #A0D071 50%, #E5FC97 100%);
  -moz-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.40), inset 0px 1px 1px 0px #426844, inset 0px 3px 0px 0px rgba(255, 255, 255, 0.50);
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.40), inset 0px 1px 1px 0px #426844, inset 0px 3px 0px 0px rgba(255, 255, 255, 0.50);

}

span.off-badge {
  display: inline-block;
  border-radius: 5px;

  width: 10px;
  height: 10px;

  /* Oval 6: */
  background-image: -o-linear-gradient(-89deg, #FF2402 0%, #D61B00 49%, #FEC7C6 89%);
  background-image: -moz-linear-gradient(-89deg, #FF2402 0%, #D61B00 49%, #FEC7C6 89%);
  background-image: -ms-linear-gradient(-89deg, #FF2402 0%, #D61B00 49%, #FEC7C6 89%);
  background-image: linear-gradient(-179deg, #FF2402 0%, #D61B00 49%, #FEC7C6 89%);
  -moz-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.40), inset 0px 0px 2px 0px #785757, inset 0px -1px 1px 0px #6A0701;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.40), inset 0px 0px 2px 0px #785757, inset 0px -1px 1px 0px #6A0701;
}

.nfo {
  font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
  font-size: 11px;
  color: #808080;
  line-height: 13px;
  /* Hier finden: */
}

table.table-content-block {
  width: 100%;

  td {
    vertical-align: top;
    padding: 0 2px;
    padding-bottom: 5px;

    &.td-label {
      width: 120px;
      text-align: right;
      padding-right: 5px;
    }

    &.td-actions {
      text-align: right;
    }
  }
}

span.entypo-right.maverix-circle {
  display: inline-block;
  background-color: #474747;
  color: #ffffff;
  border-radius: 50px;
  font-size: 8px;
  line-height: 10px;
  width: 10px;
  height: 10px;
  text-align: center;

  position: relative;
  top: -1px;
}

.indent {
  margin-left: 20px;
}

ul.list-unstyled {
  li {
    line-height: 22px;
  }

  select {
    position: relative;
    top: -2px;
  }

  input[type=checkbox] {
    position: relative;
    top: 0px;
  }
}

.grey-bg {
  background-color: #e8e8e8;

  .btn.btn-on-grey {
    margin: 0 4px;
  }
}

.toolbar-button {
  border-radius: 3px;
  height: 22px;
  display: inline-block;
  padding: 3px 12px;
  /* Rectangle 25: */
  background-image: -o-linear-gradient(-89deg, #F5F5F5 0%, #B3B3B3 100%);
  background-image: -moz-linear-gradient(-89deg, #F5F5F5 0%, #B3B3B3 100%);
  background-image: -ms-linear-gradient(-89deg, #F5F5F5 0%, #B3B3B3 100%);
  background-image: linear-gradient(-179deg, #F5F5F5 0%, #B3B3B3 100%);
  border: 1px solid #7E7E7E;
  -moz-box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.40);
  box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.40);

  font-family: Lucida Grande, Lucida Sans, Arial, sans-serif;
  font-weight: normal;
  color: #404040;
  line-height: 14px;
  text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.40);

  &:hover {
    text-decoration: none;
    color: #404040;
  }

  &:active {
    color: #000000;

    border-radius: 3px;
    /* Rectangle 26: */
    background-image: -o-linear-gradient(-89deg, #B3B3B3 0%, #E8E8E8 100%);
    background-image: -moz-linear-gradient(-89deg, #B3B3B3 0%, #E8E8E8 100%);
    background-image: -ms-linear-gradient(-89deg, #B3B3B3 0%, #E8E8E8 100%);
    background-image: linear-gradient(-179deg, #B3B3B3 0%, #E8E8E8 100%);
    border: 1px solid #7E7E7E;

    -moz-box-shadow: inset 0px 1px 5px 0px rgba(0, 0, 0, 0.40), 0px 1px 0px 0px rgba(255, 255, 255, 0.40);
    box-shadow: inset 0px 1px 5px 0px rgba(0, 0, 0, 0.40), 0px 1px 0px 0px rgba(255, 255, 255, 0.40);
  }
}

.toolbar {
  background-image: url("../img/grey-bg.png");
  height: 35px;
  padding: 6px 10px;

  border-top: 1px solid #5e5e5e;

  -moz-box-shadow: inset 0px 1px 0px 0px #E1E1E1;
  box-shadow: inset 0px 1px 0px 0px #E1E1E1;
}

.toolbar-off {
  background-image: url("../img/off-grey-bg.png");
  height: 34px;
  padding: 6px 10px;

  border-top-color: #9b9b9b;
  -moz-box-shadow: inset 0px 1px 0px 0px #F2F2F2;
  box-shadow: inset 0px 1px 0px 0px #F2F2F2;
}

// MODALS
.modal {
}

.modal-backdrop {
  background-color: #000000;
}

.modal-backdrop.in {
  filter: alpha(opacity=70);
  opacity: .7;
}

.modal-dialog {
}

.modal-content {
}

.modal-header {
  background-color: #f5f7f9;
  padding: 20px;
  border-bottom: 1px solid #ada6ac;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;

  .modal-title {
    font-family: Helvetica, arial, verdana, sans-serif;
    font-weight: bold;
    font-size: 26px;
    color: #3C3C3C;
    line-height: 31px;
  }

  .modal-subtitle {
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    font-size: 13px;
    color: #999;
    line-height: 15px;
  }

}

.modal-body {
}

.modal-footer {
  background-color: #e8e8e8;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  height: 45px;
  padding: 10px;
  border-top: 1px solid #a8a8a8;
}

// Button Animation Keyframes
@-webkit-keyframes blinking {
  from {
    -webkit-box-shadow: inset 0 19px 0 rgba(0, 115, 215, 0),
    inset 0 1px 0 rgba(255, 255, 255, 1),
    0 1px 0 rgba(0, 0, 0, 0.09);
  }
  50% {
    -webkit-box-shadow: inset 0 19px 0 rgba(0, 115, 215, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 1),
    0 1px 0 rgba(0, 0, 0, 0.09);
  }
  to {
    -webkit-box-shadow: inset 0 19px 0 rgba(0, 115, 215, 0),
    inset 0 1px 0 rgba(255, 255, 255, 1),
    0 1px 0 rgba(0, 0, 0, 0.09);
  }
}

@-moz-keyframes blinking {
  from {
    -moz-box-shadow: inset 0 19px 0 rgba(0, 115, 215, 0),
    inset 0 1px 0 rgba(255, 255, 255, 1),
    0 1px 0 rgba(0, 0, 0, 0.09);
  }
  50% {
    -moz-box-shadow: inset 0 19px 0 rgba(0, 115, 215, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 1),
    0 1px 0 rgba(0, 0, 0, 0.09);
  }
  to {
    -moz-box-shadow: inset 0 19px 0 rgba(0, 115, 215, 0),
    inset 0 1px 0 rgba(255, 255, 255, 1),
    0 1px 0 rgba(0, 0, 0, 0.09);
  }
}

@keyframes blinking {
  from {
    box-shadow: inset 0 19px 0 rgba(0, 115, 215, 0),
    inset 0 1px 0 rgba(255, 255, 255, 1),
    0 1px 0 rgba(0, 0, 0, 0.09);
  }
  50% {
    box-shadow: inset 0 19px 0 rgba(0, 115, 215, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 1),
    0 1px 0 rgba(0, 0, 0, 0.09);
  }
  to {
    box-shadow: inset 0 19px 0 rgba(0, 115, 215, 0),
    inset 0 1px 0 rgba(255, 255, 255, 1),
    0 1px 0 rgba(0, 0, 0, 0.09);
  }
}

// HACKY STYLES
.content-block {
  margin-bottom: 30px;
}

ul.entypo-ul {
  li {
    display: inline-block;
    font-size: 20px !important;
    line-height: 28px !important;
  }
}

.emoji-font {
  font-family: "Apple Color Emoji";
  font-size: 20px !important;
  line-height: 28px !important
}
